<template>
  <div style="margin: 15px">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="待结算订单" name="apply" :key="'apply'">
        <apply  v-if="applySettlement"></apply>
      </el-tab-pane>
      <el-tab-pane label="结算中订单" name="dispose" :key="'dispose'">
        <dispose v-if="disposeSettlement"></dispose>
      </el-tab-pane>
      <el-tab-pane label="已结算订单" name="finish" :key="'finish'">
        <finish v-if="finishSettlement"></finish>
      </el-tab-pane>
      <el-tab-pane label="驳回订单" name="reject" :key="'reject'">
        <reject v-if="rejectSettlement"></reject>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
  import applySettlement from '@/views/supplier/settlement/applySettlement';
  import disposeSettlement from '@/views/supplier/settlement/disposeSettlement';
  import finishSettlement from '@/views/supplier/settlement/finishSettlement';
  import rejectSettlement from '@/views/supplier/settlement/rejectSettlement';
  export default {
    components: {
      apply: applySettlement,
      dispose: disposeSettlement,
      finish: finishSettlement,
      reject:rejectSettlement
    },
    data() {
      return {
        activeName: 'apply',
        applySettlement: true,
        disposeSettlement: false,
        finishSettlement:false,
        rejectSettlement:false
      };
    },
    methods: {
      handleClick(tab, event) {
        if (tab.name === 'apply') {
          this.applySettlement = true
          this.disposeSettlement = false
          this.finishSettlement = false
          this.rejectSettlement = false
        } else if (tab.name === 'dispose') {
          this.applySettlement = false
          this.finishSettlement = false
          this.disposeSettlement = true
          this.rejectSettlement = false
        }else if (tab.name === 'finish') {
          this.applySettlement = false
          this.finishSettlement = true
          this.disposeSettlement = false
          this.rejectSettlement = false
        }else if (tab.name === 'reject'){
          this.applySettlement = false
          this.finishSettlement = false
          this.disposeSettlement = false
          this.rejectSettlement = true
        }
      },
    }
  };
</script>
